<template>


  <div>

    <input type="text" v-focus v-color="'red'">

  </div>
</template>

<script>
//局部指令

export default {
  name: "UserDirective",
  directives:{
    focus:{
      inserted(el){
        el.focus()
      }
    },
    color:{
      inserted(el,binding){
        el.style.color=binding.value//只有在插入网页的时候执行一次
      },
      update(el,binding){//后需要向执行就要通过这个函数，这个函数会在要传入的值变化的时候执行
        el.style.color=binding.value
      }
    }
  }
}
</script>

<style scoped>

</style>